/* 问卷管理页面js 包含页面展示、删除、全选、点击操作按钮对操作的id进行存储 */
/* 点击编辑存储edit-id 点击填写存储write-id */

// 展示在页面上
function show(){
    var Str = '';
    for(let i = 0;i<Arr.length;i++){
    Str +=  '<div class="list">'+
                '<div class="button-circle"><input type="checkbox" class="btn" name="btn-one"></div>'+
                '<div class="id">'+(Arr[i].id)+'</div>'+
                '<div class="title">'+(Arr[i].title)+'</div>'+
                '<div class="time">'+(Arr[i].time)+'</div>'+
                '<div class="status">'+(Arr[i].status)+'</div>'+
                '<div class="oper">'+
                    '<a href="javascript:;"  class="edit-one" >编辑</a>&nbsp&nbsp'+
                    '<a href="javascript:;" class="del-one">删除</a>&nbsp&nbsp'+
                    '<a href="#" class="look">查看数据</a>&nbsp&nbsp'+
                    '<a href="#" class="write">填写问卷</a>'+
                '</div>'+
                '<div class="line"></div>'+
            '</div>'
            
    }
    // 全选按钮
    Str += '<div class="opers">'+
    '<div class="allCheck">'+
        '<div class="button-circle">'+
            '<input type="checkbox" class="btn" name="btn-all">'+
        '</div>'+
        '<div class="all">全选</div>'+
    '</div>'+
    '<div class="del" id="all-del">'+
        '<a href="javascript:;">删除</a>'+                                         
    '</div>'+
    '</div>'
    document.getElementsByClassName('lists')[0].innerHTML = Str 
} 
show()
// 获取状态
const statusWrap = document.getElementsByClassName("status")
// 用于修改状态颜色
function changeStatusColor(){
    for(let i=0;i<statusWrap.length;i++){
        console.log(statusWrap[i].textContent); 
        if(statusWrap[i].textContent==="发布中"){
            statusWrap[i].style.color="rgb(85,227,68)";
        }
        if(statusWrap[i].textContent==="已结束"){
            statusWrap[i].style.color="rgb(254, 134, 134)";
        }
    }
    
}

// 全选框
const all = document.getElementsByName("btn-all")[0]
// 其他普通框的集合
const others = document.getElementsByName("btn-one")
// 弹出的窗口
const cover = document.querySelector(".cover");
// 关闭弹出窗口
const close = document.querySelector("#close");
// 取消按钮
const no = document.querySelector("#no");
// 获取删除全部按钮
const delAll = document.getElementById("all-del")
// 获取弹出层文字
const word = document.getElementsByClassName("word")[0]

// 全选框的状态改变时，以上框的全部状态与全选框相同
all.onchange = function(){
    for(let i = 0; i<others.length ; i++) {
         others[i].checked = this.checked;
    }
}

// 在其他checkbox改变时，检验是否全选，若不全选，则取消全选框的选中状态
for(let i = 0; i<others.length ; i++) {
    others[i].onchange = function(){
        const checkeds = document.querySelectorAll("[name=btn-one]:checked");
        if(checkeds.length === others.length){
            all.checked=true;
        }else{
            all.checked=false;
        }
    }
}
// 用于存储删除的数据  
var dels=[]
var delObjs=[]
// console.log(links);
// 获取全部删除超链接
const links = document.getElementsByClassName("del-one")
// 普通删除按钮
for(let i =0;i<links.length;i++){
    links[i].onclick = function(){
        // dleObj为点删除时按钮所在的对象
        const delObj = this.parentNode.parentNode // this=a this.parentNode=oper this.parentNode.parentNode=div
        delObjs[delObjs.length] = delObj
        const delId = delObj.getElementsByTagName("div")[1].textContent
        // console.log(delId);
        dels[dels.length]=delId
        // console.log(dels);
        //获取标签名
        const delTitle = delObj.getElementsByTagName("div")[2].textContent
        word.textContent = "确认要删除【"+delTitle+"】吗？"
        console.log(Arr);
        cover.style.display = "block";        
        
    }

    
}
// delAll.addEventListener('click', () => { cover.style.display = "block"; });
// 全选删除按钮
delAll.onclick = function(){
    const checkeds = document.querySelectorAll("[name=btn-one]:checked");
    if(checkeds.length===0){
        return
    }
    for(let i=0;i<checkeds.length;i++){
        delObjs[delObjs.length]=checkeds[i].parentNode.parentNode;
        dels[dels.length] = checkeds[i].parentNode.parentNode.getElementsByTagName("div")[1].textContent
    }
    // console.log(dels);
    word.textContent = "确认要删除所选问卷吗"
    cover.style.display = "block";
    
}
// 编辑按钮
const edits = document.getElementsByClassName("edit-one")
for(let i =0;i<edits.length;i++){
    edits[i].onclick = function(){
        // editObj为点编辑时按钮所在的对象
        const editObj = this.parentNode.parentNode 
        // console.log(editObj);
        let editId = editObj.getElementsByClassName("id")[0].textContent
        console.log(editId);
        localStorage.setItem("edit-id",editId)
        window.location.href = "../newEdit.html"  
    }    
}
// 填写按钮
const writes = document.getElementsByClassName("write")
for(let i =0;i<writes.length;i++){
    writes[i].onclick = function(){
        // writeObj为点编辑时按钮所在的对象
        const writeObj = this.parentNode.parentNode 
        // console.log(writeObj);
        let writeId = writeObj.getElementsByClassName("id")[0].textContent
        // console.log(writeId);
        localStorage.setItem("write-id",writeId)
        window.location.href = "../newEdit.html"  
    }    
}
// 查看数据按钮
const looks = document.getElementsByClassName("look")
for(let i =0;i<looks.length;i++){
    looks[i].onclick = function(){
        // lookObj为点编辑时按钮所在的对象
        const lookObj = this.parentNode.parentNode 
        // console.log(writeObj);
        let lookId = lookObj.getElementsByClassName("id")[0].textContent
        // console.log(lookId);
        localStorage.setItem("look-id",lookId)
        window.location.href = "../look.html"  
    }    
}
// 操作按钮的显示
const list = document.getElementsByClassName("list")
// 当一个问卷都没有的时候，表格不展现，页面正中央显示新建问卷按钮
function isNull(){
    if(list.length===0){
        window.location.href = "../newInit.html"  
    }
    return
}

for(let i=0;i<list.length;i++){
    // 问卷截止时间超过当前日期改为已结束
    if(list[i].getElementsByClassName("time")[0].textContent<getNowFormatDay()){
        list[i].getElementsByClassName("status")[0].textContent="已结束"
    }
    // 问卷状态为未发布时，可以做的操作为编辑、删除
    if(list[i].getElementsByClassName("status")[0].textContent==="未发布"){
        list[i].getElementsByClassName("look")[0].style.display="none"
        list[i].getElementsByClassName("write")[0].style.display="none"
    }else if(list[i].getElementsByClassName("status")[0].textContent==="发布中"){
        list[i].getElementsByClassName("edit-one")[0].style.display="none"
    }else if(list[i].getElementsByClassName("status")[0].textContent==="已结束"){
        list[i].getElementsByClassName("edit-one")[0].style.display="none"
        list[i].getElementsByClassName("write")[0].style.display="none"
    }
    // console.log(1);
}
console.log(list);
// 关闭弹出窗口
close.addEventListener('click', () => { 
    cover.style.display = "none"; 
});
no.addEventListener('click', () => { 
    cover.style.display = "none"; 
    dels=[]
    return
});
yes.addEventListener('click', () => { 
    console.log(dels);
    cover.style.display = "none"; 
    for(let i=0;i<dels.length;i++){
        for(let j=0;j<Arr.length;j++){
            if(Arr[j].id===dels[i]){
                console.log("yes");
                Arr.splice(j,1);
                j--;
            }
        }
    }
    for(let i=0;i<delObjs.length;i++){
        delObjs[i].remove()
    }
    ArrText=JSON.stringify(Arr)
    localStorage.setItem("ArrText",ArrText)
    // console.log(Arr);
    dels=[]
    all.checked=false;
    isNull()
    // show()
    return
});
// 修改颜色
changeStatusColor();



